<template>
	<view>
		<view class="title">注册</view>
		<view class="loginform">
			<view class="loginform-item">
				<text class="number-title">+86</text>
				<image class="down-icon" src="../../static/down.png">
				<input maxlength="11" type="number" placeholder="请输入您的手机号" placeholder-class="placeholderClass" v-model="mobile" />
			</view>
			<view class="loginform-item">
				<input class="textleft" v-model="password" password placeholder="请输入密码" placeholder-class="placeholderClass"/>
			</view>
			<view class="loginform-yzm">
				<input class="textleft" v-model="code" placeholder="请输入验证码" placeholder-class="placeholderClass"/>
				<text v-show="isVisable" @click="getCode">获取验证码</text>
			</view>
			<view class="loginform-item">
				<text>推荐人：{{refMobileStr}}</text>
			</view>
			<view class="btnbox">
				<button @click="register">注册</button>
			</view>
		</view>
		<view class="rule">
			<label class="radio"><radio value="r1" color="#37C2BC"  checked="" />选中</label>

			<text>进入即代表同意</text>
			<text class="blue" @click="kf(1)">用户协议</text>和<text class="blue" @click="kf(2)">隐私协议</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				mobile:'',
				isVisable:true,
				password:'',
				code:'',
				refMobile:'',
				refMobileStr:''
			}
		},
		
		onLoad(option){
			
			if (option.scene) {
				console.info("====扫码进入====")
				this.isScan = true;
				let scene = decodeURIComponent(option.scene);
				//&是我们定义的参数链接方式
				this.refMobile = scene;
				var str=scene;
				this.refMobileStr = str.substr(0,3)+"****"+str.substr(7);
				
			}
		},
		methods: {
			
			kf(type){
				
				if(type == 1){
					uni.navigateTo({
						url:'../usercenter/kf?url='+encodeURIComponent("https://mp.weixin.qq.com/s/8YPnaRfKZl9gaYJvlOFSnA")
					})
				}else{
					uni.navigateTo({
						url:'../usercenter/kf?url='+encodeURIComponent("https://mp.weixin.qq.com/s/8YPnaRfKZl9gaYJvlOFSnA")
					})
				}
				
				
			},
			
			doCheck(evt){
				var e  =  evt.detail.value;
				console.info("===doCheck==="+e)
			},
			
			getCode(){
				let param = {
					mobile: this.mobile,
					type:'register'
				}
				let that = this;
				this.$api.sendMessage(param).then(res => {
					
					if(res.code == 1){
						that.$util.$showToast('发送成功', '', 'none');
					}else{
						that.$util.$showToast(res.msg, '', 'none');
						
					}
				})
			},
			register(){
				
				if(this.mobile == ''){
					this.$util.$showToast('手机号不能为空', '', 'none');
					return;
				}
				if(this.password == ''){
					this.$util.$showToast('密码不能为空', '', 'none');
					return;
				}
				if(this.code == ''){
					this.$util.$showToast('验证码不能为空', '', 'none');
					return;
				}
				if(this.refMobile == ''){
					this.$util.$showToast('推荐人手机号不能为空', '', 'none');
					return;
				}
				let param = {
					mobile: this.mobile,
					password:this.password,
					code:this.code,
					refMobile:this.refMobile
				}
				let that = this;
				this.$api.register(param).then(res => {
					
					if(res.code == 1){
						uni.navigateTo({
							url:'../login/login?enter=register'
						});
						
					}else{
						that.$util.$showToast(res.msg, '', 'none');
						
					}
				})
			}
		}
	}
</script>

<style lang="scss">
.title{
	margin: 62rpx 94rpx;
	font-size:54rpx;
	color: $uni-text-color;
}
.loginform{
	margin:95rpx 95rpx;
	.loginform-item{
		border-bottom: 1rpx solid #EFEFEF;
		display: flex;
		height: 135rpx;
		line-height: 135rpx;
		.down-icon{
			width: 30rpx;
			height: 30rpx;
			margin-top: 52rpx;
			margin-right: 20rpx;
		}
		.number-title{
			font-size: 30rpx;
			color: #666666;
		}
		input{
			margin-top: 52rpx;
			text-align: center;
			font-size: 32rpx;
			color: #454545;
		}
		.textleft{
			text-align: left;
		}
	}
	.loginform-yzm{
		display: flex;
		border-bottom: 1rpx solid #EFEFEF;
		height: 135rpx;
		line-height: 135rpx;
		input{
			margin-top: 52rpx;
			font-size: 32rpx;
			flex: auto;
			font-size: 30rpx;
		}
		text{
			color: #37C2BC;
			font-size: 30rpx;
		}
	}
}
.rule{
	position: absolute;
	bottom: 120rpx;
	width: 100%;
	text-align: center;
	color: $uni-text-color-grey;
	font-size: 24rpx;
	text{
		font-size: 24rpx;
		color: $uni-text-color-grey;
	}
	.blue{
		color: $uni-color-primary;
		text-decoration: underline;
		margin-left: 10rpx;
	}
}
.btnbox{
	margin-top: 69rpx;
}
</style>
